<template>
  <div id='app'>
    <router-view />
  </div>
</template>
<script>
export default {
  created () {
    // page load and read vuex state grom sessionStorage
    sessionStorage.getItem('vuex') && this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(sessionStorage.getItem('vuex'))))
    // page refresh save vuex statw to sessionStorage
    window.addEventListener('beforeunload', () => {
      sessionStorage.setItem('vuex', JSON.stringify(this.$store.state))
    })
  },
}
</script>
<style lang="scss">
body {
  overflow-y: scroll;
}
#app {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: #f7f8fa;
}
img {
  border: none;
}
img[lazy="loading"] {
  background: url("//oss.baobaobooks.net/misc/store_place_new.png") no-repeat center;
  background-size: 25%;
}
.overflow {
  overflow: hidden;
}
img[lazy="error"] {
    background: url("//oss.baobaobooks.net/shop/mobile/static/img_manual/img_none.png") no-repeat center;
    background-size: 75%;
}
img:not([src]) {
  visibility: hidden;
}
:global(.van-icon-delete) {
  font-size: 18px;
}
@media all and (min-width: 640px) {
  #app {
    width: 640PX;
    margin: 0 auto;
  }
  #should-login {
    width: 640PX !important;
    left: 50% !important;
    transform: translateX(-50%);
  }
  .footer-bottom {
    width: 640PX !important;
    left: 50% !important;
    transform: translateX(-50%);
  }
  body {
    width: 640PX;
    margin: auto;
    position: relative;
  }
  :global(.van-nav-bar--fixed) {
    width: 640PX !important;
    left: 50% !important;
    margin-left: -320PX !important;
  }
  :global(.van-button--danger) {
    &.pageBottom {
        width: 640PX !important;
        left: 50% !important;
        margin-left: -320PX !important;
    }
  }
  :global(.van-tabs__wrap) {
    width: 640PX !important;
    left: 50% !important;
    margin-left: -320PX !important;
  }
  :global(.van-icon-arrow-left) {
    cursor: pointer;
  }
  :global(.van-goods-action) {
    width: 640PX !important;
    left: 50% !important;
    margin-left: -320PX !important;
  }
}
</style>
